<!-- html -->
<template>
  <h2 class="h2">作用域插槽</h2>
  <span class="span3">新闻</span>
  <br>
  <!-- 从插槽接收数据并展示 -->
  <slotTest3Child v-slot:title="{ title }">
    <span class="span3">{{ title }}</span>
  </slotTest3Child>
  <slotTest3Child v-slot:content="{ news }">
    <li class="li1" v-for="item in news">{{ item }}</li>
  </slotTest3Child>
</template>

<!-- js或ts -->
<script lang="ts">
export default {
  name: 'slotTest3'
}
</script>

<!-- js或ts -->
<script setup lang="ts">
import slotTest3Child from '@/components/slot/SlotTest3Child.vue'
</script>

<!-- 样式 -->
<style scoped></style>